<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>天大实验仪器预约</title>
        <link rel="shortcut icon" href="/favicon.ico" />
        <link rel="stylesheet" href="/layui/css/layui.css">
        <link rel="stylesheet" href="/css/common.css">
        <link rel="stylesheet" href="/css/base.css">
        <link rel="stylesheet" href="/css/login.css">
    </head>

    <body>
        <!-- 头部制作 start-->
        <header class="header w">
            <div class="logo">
                <img src="/images/logo.jpg" alt="">
            </div>
            <div class="tit">
                <h3>天津大学化工学院</h3>
            </div>
            <div class="links">
                <a href="" target="_blank">关于实验</a>
                <a href="">注册</a>
            </div>
        </header>
        <!-- 头部制作 end -->

        <!-- 登录主体 start -->
        <div class="login_frame">
            <div class="login w">
                <div class="logo_zuzhi">
                    <img src="/images/logo.jpg" alt="">
                </div>
                <form action="#" class="layui-form" method="POST" th:action="@{/login}">
                    <div class="hd">
                        <h2>欢迎使用天津大学实验仪器预约系统</h2>
                    </div>
                    <div th:text="${msg}" style="color:#F00" th:size="10"></div>
                    <div class="layui-form-item">
                        <!-- <label for="" class="layui-form-label">账号</label> -->
                        <div class="layui-input-block">
                            <input type="text" name="account" placeholder="账号" autocomplete="off" lay-verify="required"
                                class="layui-input" th:name="id">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <!-- <label for="" class="layui-form-label">密码</label> -->
                        <div class="layui-input-block">
                            <input type="password" name="password" placeholder="密码" autocomplete="off" lay-verify="required"
                                class="layui-input" th:name="password">
                        </div>
                    </div>
                    <div class="layui-form-item relative">
                        <div class="layui-input-block">
                            <button class="btn layui-btn" lay-submit lay-filter="*">登录</button>
                            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <!-- 登录主体 end -->

        <!-- 底部制作 start -->
        <footer class="footer w">
            <div class="mod_copyright w">
                <div class="links">
                    <a href="#">联系我们</a>
                </div>
                <div class="copyright">
                    @天津大学化工学院 版权所有
                </div>
            </div>
        </footer>
        <!-- 底部制作 end -->

        <!-- js start -->
        <script src="/layui/layui.js"></script>
        <script>
            //Demo
            layui.use('form', function () {
                var form = layui.form;

                //监听提交
                form.on('submit(formDemo)', function (data) {
                    layer.msg(JSON.stringify(data.field));
                    return false;
                });
            });
        </script>
        <!-- js end -->
    </body>
</html>